<!-- 员工库 -->
<template>
	<template>
		<teleport :to="searchContainer">
			<search-input v-model:params="params" v-bind="searchOption" />
		</teleport>
	</template>
	<vxe-grid ref="grid" v-bind="gridOptions">
		<template #action="{row}">
			<a @click="handler(row)">去签约</a>
		</template>
	</vxe-grid>
	<owner-sign
		v-model:visible="visibles.ownerSign"
		@success="close"
		:contract="{
			houseId: houseId,
			singType: 1
		}" />
</template>

<script setup lang="ts">
	import {reactive, ref, onMounted} from 'vue'
	import {VxeGridProps} from 'vxe-table'
	import {pagerConfig, proxyConfigProps} from 'yuxin-base/src/utils/vxe-table'
	import {SearchProps} from 'yuxin-base/src/types'
	import {useStore} from '@/store'
	import {remindOwnerContract} from '@/api/contract'
	import OwnerSign from '@/components/contract/signing/owner-sign.vue'
	import {Modal} from 'ant-design-vue'

	const hasPermissions = useStore().hasPermissions
	const props = withDefaults(
		defineProps<{
			query?: any
			source?: string
			searchContainer?: string | boolean
			id?: any
		}>(),
		{
			query: {},
			id: '',
			searchContainer: '#top_search'
		}
	)

	const params = reactive<any>({
		houseType: 0,
		current: null,
		deptId: null,
		empId: null,
		like: null,
		size: null,
		address: null
		// status: null
	})
	const visibles = reactive<any>({
		teleport: false,
		isShowImportEmployees: false,
		ownerSign: false
	})
	onMounted(() => {
		visibles.teleport = true
	})
	// 搜索配置
	const searchOption = reactive<SearchProps>({
		placeholder: '房源地址',
		onSearch() {
			params.address = params.like
			getList()
		}
	})

	const grid = ref()

	const houseId = ref(null)

	const getList = (page?: any) => {
		grid.value.commitProxy(page === 1 ? 'reload' : 'query')
	}

	const gridOptions = reactive<VxeGridProps>({
		height: 'auto',
		showOverflow: true,
		rowConfig: {
			isHover: true
		},
		columns: [
			{
				title: '房源地址',
				resizable: true,
				minWidth: 400,
				field: 'address'
			},

			{
				title: '出租日期',
				align: 'center',
				minWidth: 200,
				field: 'avaliableDate'
			},
			{
				title: '操作',
				align: 'center',
				slots: {
					default: 'action'
				}
			}
		],
		pagerConfig,
		proxyConfig: {
			props: proxyConfigProps,
			ajax: {
				query({page: {currentPage: current, pageSize: size}}) {
					return queryData({...params, ...props.query, current, size})
				}
			}
		}
	})

	const queryData = (params: any) => {
		return remindOwnerContract(params)
	}

	const handler = (data: any) => {
		houseId.value = data.houseType === 2 ? data?.housePid : data?.houseId
		visibles.ownerSign = true
	}

	const close = () => {
		visibles.ownerSign = false
		Modal.info({
			title: '提示',
			okText: '确定',
			content: () => '后台数据正在同步，请耐心等待',
			onOk() {
				getList()
			}
		})
	}
</script>

<style scoped></style>
